<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>已接订单</title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="css/mui.min.css" rel="stylesheet" />
		<style>
			#centrelater{
				background-color: #23CAD0;
			}
			#centrelater li span{
				display: flex;
			}
			#centrelater li h3{
				margin-left: 120px;
			}
			#later{
				color: white;
			}
			#courier span{
				display: flex;
			}
			#courier h5{
				margin-left: 125px;
			}
			#order1 li{
				list-style: none;
			}
			#ordernumber{
				height: 50px;
				background-color: #8F8F94;
			}
			#num1{
				width: 30px;
				height: 30px;
				border-radius: 50%;
				background-color: #F5741B;
				color: white;
				text-align: center;
				padding-top: 5px;
				margin-top:8px;
			}
			#one{
				display: flex;
				margin:20px;
			}
			#one span{
				margin-top: 10px;
			}
			#address1{
				margin-left: 10px;
			}
			#time1{
				display: flex;
				margin-left: 10px;
				margin-top: 10px;
			}
			#time1 span{
				display: flex;
			}
			#time1 h3{
				color: #F7914E;
			}
			#delivery{
				height: 70px;
				background-color: white;
			}
            #color1{
            	height: 3px;
            	background-color:#8F8F94;
            }
            #types1{
            	display: flex;
            }
			#types1 span{
				color:#F7914E ;
			}
			#types1 h5{
				color:#F7914E ;
			}
			#kinds1{
				height: 30px;
				background-color: white;
			}
			#ordernumber1{
				margin-top: 150px;
			}
			#num2{
				width: 30px;
				height: 30px;
				border-radius: 50%;
				background-color: #F5741B;
				color: white;
				text-align: center;
				padding-top: 5px;
				margin-top:8px;
			}
			#one2{
				display: flex;
				margin:20px;
			}
			#one2 span{
				margin-top: 10px;
			}
			#ordernumber1{
				height: 50px;
				background-color:#8F8F94;
			}
			
			#ordernumber2{
				margin-top: 150px;
			}
			#num3{
				width: 30px;
				height: 30px;
				border-radius: 50%;
				background-color: #F5741B;
				color: white;
				text-align: center;
				padding-top: 5px;
				margin-top:8px;
			}
			#one3{
				display: flex;
				margin:20px;
			}
			#one3 span{
				margin-top: 10px;
			}
			#ordernumber2{
				height: 50px;
				background-color:#8F8F94;
			}
			#all{
				margin-top: 120px;
				text-align: center;
			}
			
			#distribution{
				height: 80px;
			}
			#begin1 p{
				margin: 0px;
				border: solid aliceblue ;
				width: 120px;
				height: 80px;
				margin-left: 260px;
				background-color: #F7F7F7;
				text-align: center;
			}
			#altogether1{
				padding-top: 15px;
				width: 80%;
				border-top:solid 1px gray ;
				background-color: white;
				padding-left: 10px;
				padding-right: 10px;
			}
			#button{
				height: 80px;
				width: 90px;
				background-color:#8F8F94 ;
			}
		    #foot{
		    	margin-top:15px;
		    }
		    #foot ul{
		    	display: flex;
		    }
		</style>
	</head>

	<body>
		<div id="laterMoney">
	      	<ul class="mui-table-view" id="centrelater">
				<li class="mui-table-view-cell">
					<span class="mui-icon mui-icon-arrowleft" id="later"><h3>袋鼠捎货</h3></span>
				</li>
				
			</ul>
	      </div>
	    <section id="centre">
	    	<ul class="mui-table-view" id="courierCentre">
	    		<li class="mui-table-view-cell" id="courier">
					<span class="mui-icon mui-icon-arrowleft" id="staff"><h5>已接订单</h5></span>
				</li>
	    	</ul>
	        <div id="ordernumber">
	    		<div id="one">
	    		    <div id="num1">1</div>
	    			<span>订单号：345562586332</span>
	    			<span>&nbsp;&nbsp;接单时间11:59</span>
	    		</div>
	    		<div id="delivery">
	    			<div id="address1">郑州市金水区绿地-峰会天下1004</div>
	    			<div id="time1">明天(周三)15:00送达&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span>配送费<h3>25元</h3></span></div>
	    		</div>
	    		<div id="color1"></div>
	    		<div id="weight1">
	    			<div id="kinds1">
	    				<span id="types1">共计<span>7</span>箱货品,总重<span>120</span>kg<h5>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;查看详细货品</h5><span class="mui-icon mui-icon-arrowright"></span></span>
	    			</div>
	    		</div>
	    	</div>
	    	
	    	<div id="ordernumber1">
	    		<div id="one2">
	    		    <div id="num2">2</div>
	    			<span>订单号：345562586332</span>
	    			<span>&nbsp;&nbsp;接单时间11:59</span>
	    		</div>
	    		<div id="delivery">
	    			<div id="address1">郑州市金水区绿地-峰会天下1004</div>
	    			<div id="time1">明天(周三)15:00送达&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span>配送费<h3>25元</h3></span></div>
	    		</div>
	    		<div id="color1"></div>
	    		<div id="weight1">
	    			<div id="kinds1">
	    				<span id="types1">共计<span>7</span>箱货品,总重<span>120</span>kg<h5>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;查看详细货品</h5><span class="mui-icon mui-icon-arrowright"></span></span>
	    			</div>
	    		</div>
	    	</div>
	    	
	    	
	    	<div id="ordernumber2">
	    		<div id="one3">
	    		    <div id="num3">3</div>
	    			<span>订单号：345562586332</span>
	    			<span>&nbsp;&nbsp;接单时间11:59</span>
	    		</div>
	    		<div id="delivery">
	    			<div id="address1">郑州市金水区绿地-峰会天下1004</div>
	    			<div id="time1">明天(周三)15:00送达&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span>配送费<h3>25元</h3></span></div>
	    		</div>
	    		<div id="color1"></div>
	    		<div id="weight1">
	    			<div id="kinds1">
	    				<span id="types1">共计<span>7</span>箱货品,总重<span>120</span>kg<h5>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;查看详细货品</h5><span class="mui-icon mui-icon-arrowright"></span></span>
	    			</div>
	    		</div>
	    	</div>
	    	<div id="all">
	    		<p>显示全部</p>
	    		<span class="mui-icon mui-icon-arrowdown"></span>
	    	</div>
	    	
	    	
	    </section>
	    <!--开始配送-->
	    <div id="foot">
	    	<ul class="mui-table-view" id="distribution">
	    		<li id="altogether1">
	    			<p><h4>已接35单,总重1250Kg,共计450元</h4></p>
	    		</li>
	    		<li id="begin1">
					<button type="button" id="button">开始配送</button>
				</li>
	    	</ul>
	    </div>
		<script src="js/mui.min.js"></script>
		<script type="text/javascript">
			mui.init()
		</script>
	</body>

</html>